<template>
	<view class="clientWrapper">
		<view class="clientSearchItem">
			<input class="search clientSearch" placeholder="输入商品名称/编号/条码" v-model="searchValue"></input>
		</view>
		<view class="clientSearchItem02">
			<button class="searchBt" @tap="searchGoodsType()" style="">搜索</button>
			<button class="searchBt" data-target="OptionModal" data-state='0' @tap="lookDetail()" style="">新增</button>
		</view>
		<view class="container" v-show="isTable">
			<!-- 表格外层 -->
			<view class="tdHeader" :style="{width:allWidth+'px'}">
				<view class="tdTh" v-for="(item,index) in tdHeaderList" :key="item.name" :style="{width:clientSettingWidthList[index] + 'px'}"
				 @tap="SortPrice(index)">
					{{item.name}}{{item.sort}}
				</view>
			</view>
			<view class="tdContain" :style="{width:allWidth +'px',height:tdHeight+'px'}">
				<view class="tdItems" v-for="(item,index) in clientList" :key="index"  @tap="lookDetail(0,index)" data-state='1'
				 :data-index='index' data-target="OptionModal" @longtap="Del(item.GoodsID)">
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[0] + 'px'}">{{index+1}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[1] + 'px'}">{{item.GoodsCode}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[2] + 'px'}">{{item.GoodsName}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[3] + 'px'}">{{item.TypeName}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[4] + 'px'}">{{item.Spec}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[5] + 'px'}">{{item.BarCode}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[6] + 'px'}">{{item.UnitName}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[7] + 'px'}">{{item.InPrice}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[8] + 'px'}">{{item.SalePrice}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[9] + 'px'}">{{item.Price1}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[10] + 'px'}">{{item.Price2}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[11] + 'px'}">{{item.Price3}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[12] + 'px'}">{{item.VipPrice}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[13] + 'px'}">{{item.PFPrice}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[14] + 'px'}">{{item.stockqty}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[15] + 'px'}">{{item.IsStopIn?'是':'否'}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[16] + 'px'}">{{item.IsStopSale?'是':'否'}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[17] + 'px'}">{{item.IsStop?'是':'否'}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[18] + 'px'}">{{item.IsBatch?'是':'否'}}</view>
					<view class="tdItems tdItem" :style="{width:clientSettingWidthList[19] + 'px'}">{{item.ClientName}}</view>
				</view>
			</view>
		</view>
		<view :style="{height:tdListHeight+'px'}" class="listContainer" v-show="!isTable">
			<view class="tdListItem" v-for="(item,index) in clientList" :key="index" :style="{ display:(isLookMore === index) ? 'table':'block'}"
			 @longtap="Del(item.GoodsID)">
				<view  data-state='1' :data-index='index' data-target="OptionModal" class="tdListItemChild"
				 @tap="lookDetail(0,index)">
					<view class="ClientTitle">
						<view class="sortIndex">{{index+1}}</view>{{item.GoodsName}}
					</view>
					<view>商品编号:{{item.GoodsCode}}</view>
					<view>主条码:{{item.BarCode}}</view>
					<view>单位:{{item.UnitName}}</view>
					<view><text>进价:{{item.InPrice}}</text><text>零售价:{{item.SalePrice}}</text></view>
					<view><text>单价1:{{item.Price1}}</text><text>单价2:{{item.Price2}}</text></view>
					<view><text>配送价:{{item.Price3}}</text><text>会员价:{{item.VipPrice}}</text></view>
					<view><text>批发价:{{item.PFPrice}}</text><text>库存:{{item.stockqty}}</text></view>
					<view>规格:{{item.Spec}}</view>
					<view>停止进货:{{item.IsStopIn?'是':'否'}}</view>
					<view>停止销售:{{item.IsStopSale?'是':'否'}}</view>
					<view>停用:{{item.IsStop?'是':'否'}}</view>
					<view>批号管理:{{item.IsBatch?'是':'否'}}</view>
					<view>主供应商:{{item.ClientName}}</view>
				</view>
				<!-- :style="{ transform :(isLookMore == index) ? 'rotate(180deg)':'rotate( 0deg)'}" -->
				<button class="lookMoreInfo" 
				 @tap.stop="lookMore(index)">{{isLookMore == index?"收起":"展开"}}</button>
			</view>
		</view>
		<view class="options">
			<view class="cu-modal" :class="modalName=='Modal'?'show':''">
				<view class="cu-dialog">
					<view class="cu-bar bg-white justify-end">
						<view class="content">设置表格列宽度</view>
						<view class="action" @tap="hideModal">
							<text class="cuIcon-close text-red"></text>
						</view>
					</view>
					<view class="padding-xl">
						<view class="padding-xl-item" v-for="(item,index) in tdHeaderList" :key="item.name">
							<text>{{item.name}}:</text><input v-model="clientSettingTempList[index]" />
						</view>
					</view>
					<view class="cu-bar bg-white justify-end">
						<view class="action">
							<button class="cu-btn line-green text-green" @tap="hideModal()">取消</button>
							<button class="cu-btn bg-green margin-left" @tap="sureSetting()">确定</button>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
	</view>
</template>
<script>
	//速云公共接口
	import * as utilsApi from '@/syApis/syUtilsApi/utisl.js';
	import * as Api from '@/syApis/syDa/syDa.js'
	export default {
		data() {
			return {
				//搜索条件
				inputStr: "",
				//tb表头
				tdHeaderList: [{
						name: "序号",
						isSort: false,
						sort: ""
					},
					{
						name: "商品编号",
						isSort: false,
						sort: ""
					}, {
						name: "商品名称",
						isSort: false,
						sort: ""
					}, {
						name: "类型",
						isSort: false,
						sort: ""
					}, {
						name: "规格",
						isSort: false,
						sort: ""
					}, {
						name: "主条码",
						isSort: false,
						sort: ""
					}, {
						name: "单位",
						isSort: false,
						sort: ""
					}, {
						name: "进价",
						isSort: true,
						sort: ""
					}, {
						name: "零售价",
						isSort: true,
						sort: ""
					}, {
						name: "单价1",
						isSort: true,
						sort: ""
					}, {
						name: "单价2",
						isSort: true,
						sort: ""
					}, {
						name: "配送价",
						isSort: true,
						sort: ""
					}, {
						name: "会员价",
						isSort: true,
						sort: ""
					}, {
						name: "批发价",
						isSort: true,
						sort: ""
					},  {
						name: "库存",
						isSort: true,
						sort: ""
					}, {
						name: "停止进货",
						isSort: false,
						sort: ""
					}, {
						name: "停止销售",
						isSort: false,
						sort: ""
					}, {
						name: "停用",
						isSort: false,
						sort: ""
					}, {
						name: "批号管理",
						isSort: false,
						sort: ""
					}, {
						name: "主供应商",
						isSort: false,
						sort: ""
					}
				],
				//业务员搜索
				SearchOptionName: "",
				//表头宽度列表
				clientSettingWidthList: [50, 150, 150, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100,100, 100, 100, 100, 100, 100,
					100
				],
				//设置表头宽度临时列表
				clientSettingTempList: [50, 150, 150, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100,100, 100, 100, 100, 100, 100,
					100
				],
				//表格内容显示部分高度
				tdHeight: 0,
				//数据展示部分高度
				tdListHeight: 0,
				//供应商or客户列表
				clientList: [],
				//判读是否供应商
				isClient: false,
				//是否展开
				isLookMore: -1,
				//是否展示表格
				isTable: false,
				//弹框展示
				modalName: null,
				modalName02: null,
				//输入框的值
				searchValue: "",
				//底部列表滚动的高度
				bottomListHeight: 0,
				//进行操作的标识
				addOrChangeType: 0,
				//进行操作的标题
				addOrChangeTitle: "新增类别",
				//商品类别
				goodType: "",
				//弹框的显隐
				isShowDialog: false,
				//输入框的值
				goodTypeVaule: "1111",
				//机构编号
				BranchCode: "",
				//机构名称
				BranchName: "",
				OperatorList: [],
				type: 0,
				nowRote: -1,
				//点击了排序的类别索引
				clickSortTypeIndex: 0
			}
		},
		methods: {
			hideChaneg() {
				this.modalName = "";
				let tempList = [];
				this.clientSettingWidthList.forEach((item,index)=>{
					tempList.push(item);
				})
				this.clientSettingTempList = tempList;
				// uni.setStorageSync("tbWidList",JSON.stringify(tempList));
				// this.tdWidthList = this.tdWidth;
			},
			sureSetting() {
				let tempList = [];
				this.clientSettingTempList.forEach((item,index)=>{
					tempList.push(item);
				})
				this.clientSettingWidthList = tempList;
				uni.setStorageSync("InfoGoodWidthList",JSON.stringify(tempList));
				this.modalName = "";
			},
			SortPrice(index) {
				switch (index) {
					case 7:
						this.InPriceSort();
						break;
					case 8:
						this.SalePriceSort();
						break;
					case 9:
						this.Price1Sort();
						break;
					case 10:
						this.Price2Sort();
						break;
					case 11:
						this.Price3Sort();
						break;
					case 12:
						this.VipPriceSort();
						break;
					case 13:
						this.PFPriceSort();
						break;
				}
			},
			//进价排序
			InPriceSort() {
				console.log("进价排序");
				let tempList = this.clientList;
				if (this.clickSortTypeIndex != 7) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";
				}
				this.clickSortTypeIndex = 7;
				if (this.tdHeaderList[7].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].InPrice) > parseFloat(tempList[j + 1].InPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[7].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].InPrice) < parseFloat(tempList[j + 1].InPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[7].sort = "↓";
				}
				this.clientList = tempList;
			},
			//零售价排序
			SalePriceSort() {
				console.log("零售价排序");
				let tempList = this.clientList;
				if (this.clickSortTypeIndex != 8) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";

				}
				this.clickSortTypeIndex = 8;
				if (this.tdHeaderList[8].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].SalePrice) > parseFloat(tempList[j + 1].SalePrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[8].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].SalePrice) < parseFloat(tempList[j + 1].SalePrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[8].sort = "↓";
				}
				this.clientList = tempList;
			},
			//单价1排序
			Price1Sort() {
				console.log("单价1排序");
				if (this.clickSortTypeIndex != 9) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";

				}
				this.clickSortTypeIndex = 9;
				let tempList = this.clientList;
				if (this.tdHeaderList[9].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price1) > parseFloat(tempList[j + 1].Price1)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[9].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price1) < parseFloat(tempList[j + 1].Price1)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[9].sort = "↓";
				}
				this.clientList = tempList;
			},
			//单价2排序
			Price2Sort() {
				console.log("单价2排序");
				if (this.clickSortTypeIndex != 10) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";
				}
				this.clickSortTypeIndex = 10;
				let tempList = this.clientList;
				if (this.tdHeaderList[10].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price2) > parseFloat(tempList[j + 1].Price2)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[10].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price2) < parseFloat(tempList[j + 1].Price2)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[10].sort = "↓";
				}
				this.clientList = tempList;
			},
			//配送价排序
			Price3Sort() {
				console.log("配送价排序");
				if (this.clickSortTypeIndex != 11) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";
				}
				this.clickSortTypeIndex = 11;
				let tempList = this.clientList;
				if (this.tdHeaderList[11].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price3) > parseFloat(tempList[j + 1].Price3)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[11].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].Price3) < parseFloat(tempList[j + 1].Price3)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[11].sort = "↓";
				}
				this.clientList = tempList;
			},
			//会员价排序
			VipPriceSort() {
				console.log("会员价排序");
				let tempList = this.clientList;
				if (this.clickSortTypeIndex != 12) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";
				}
				this.clickSortTypeIndex = 12;
				if (this.tdHeaderList[12].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].VipPrice) > parseFloat(tempList[j + 1].VipPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[12].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].VipPrice) < parseFloat(tempList[j + 1].VipPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[12].sort = "↓";
				}
				this.clientList = tempList;
			},
			//批发价排序
			PFPriceSort() {
				console.log("批发价排序");
				if (this.clickSortTypeIndex != 13) {
					this.tdHeaderList[this.clickSortTypeIndex].sort = "";
				}
				this.clickSortTypeIndex = 13;
				let tempList = this.clientList;
				if (this.tdHeaderList[13].sort == "↓") {
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].PFPrice) > parseFloat(tempList[j + 1].PFPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[13].sort = "↑";
				} else {
					tempList = this.clientList;
					for (var i = 0; i < tempList.length; i++) {
						for (var j = 0; j < tempList.length - 1 - i; j++) {
							if (parseFloat(tempList[j].PFPrice) < parseFloat(tempList[j + 1].PFPrice)) { //相邻元素两两对比
								var temp = tempList[j + 1];
								//元素交换
								tempList[j + 1] = tempList[j];
								tempList[j] = temp;
							}
						}
					}
					this.tdHeaderList[13].sort = "↓";
				}
				console.log(this.tdHeaderList[13].sort);
				this.clientList = tempList;
			},
			//查看明细
			lookDetail(type, index) {
				let goodItem = this.clientList[index];
				console.log(goodItem);
				// return;
				this.AddListen();
				//查看明细
				if (type == 0) {
					uni.navigateTo({
						url: './goodInfoDetail?type=' + 0 + "&goodInfo=" + JSON.stringify(goodItem)
					})
				}
				//新增商品
				else {
					uni.navigateTo({
						url: './goodInfoDetail?type=' + 1
					})
				}
			},
			//查询机构
			searchGoodsType() {
				this.clickSortTypeIndex = 0;
				this.tdHeaderList[7].sort = "";
				if (this.searchValue == '') {
					this.Get_GoodsMessage();
				} else {
					let filter = "GoodsName like '%" +
						this.searchValue + "%' or GoodsCode like '%" + this.searchValue + "%'";
					this.Get_GoodsMessage(filter);
				}
			},
			//切换表格风格
			onNavigationBarButtonTap(e) {
				const index = e.index;
				console.log(index);
				if (index == 0) {
					this.changeShow();
				} else if (index == 1) {
					this.showModal();
				}
			},

			//显示弹框
			showModal() {
				this.modalName = "Modal"
			},
			//显示新增弹框
			showModal02(e) {
				this.modalName02 = e.currentTarget.dataset.target;
				let type = e.currentTarget.dataset.state;
				this.addOrChangeType = type;
				if (type == 0) {
					this.addOrChangeTitle = "新增机构档案";
					this.BranchID = "";
					this.BranchCode = "";
					this.BranchName = "";
					this.Address = "";
				} else {
					let index = e.currentTarget.dataset.index;
					let item = this.clientList[index];
					this.addOrChangeTitle = "修改机构档案";
					this.BranchID = item.BranchID;
					this.BranchCode = item.BranchCode;
					this.BranchName = item.BranchName;
					this.Address = item.Address;
				}
			},
			//隐藏弹框
			hideModal(e) {
				this.modalName = null;
				this.modalName02 = null; //关闭新增弹出框
				let tempList = [];
				this.clientSettingWidthList.forEach((item,index)=>{
					tempList.push(item);
				})
				this.clientSettingTempList = tempList;
			},
			InfoSure() {
				this.clientSettingWidthList = this.clientSettingTempList;
				this.modalName02 = null;

				if (this.addOrChangeType == 0) {
					this.addGoodsTypeName();
				} else {
					this.changeGoodsType();
				}
			},
			//获取商品档案
			Get_GoodsMessage(filter = "",isNowSort=true) {
				let data = {}
				if(this.searchValue==""){
					data = {
					  Filter: filter,
					  BillName: "商品档案"
					}
				}else{
					data = {
					  Filter: filter,
					  BillName: "商品档案",
					  BarCode:this.searchValue,
					  Model:"like"
					}
				}
				var _this = this;
				Api.Get_GoodsMessage(data, function(res) {
					if (res.state) {
						if (res.data.ErrorMsg == "获取登录信息失败") {
							Api.showTip("获取登录信息失败");
							return;
						} else if (res.data.ErrorMsg != "") {
							Api.showTip(res.data.ErrorMsg);
							return;
						} else {
							if(res.data.ResultMsg.length==0){
								Api.showTip("查无数据");
							}
							_this.clientList = res.data.ResultMsg;
							_this.searchValue = "";
							if(_this.isNowSort){
								_this.InPriceSort();
							}
							
						}
					} else {
						Api.showTip("服务器开小差了");
					}
				})
			},
			//删除商品档案
			Del(GoodsID) {
				var that = this
				Api.showConfirm("是否删除此<商品档案>", function(state) {
					if (state) {
						let data = {
							GoodsID
						}
						Api.DeleteGoodsMessage(data, function(res) {
							if (res.state) {
								if (res.data.ErrorMsg == "获取登录信息失败") {
									// api.showTip()
								} else if (res.data.ErrorMsg != "") {
									Api.showTip(res.data.ErrorMsg)
								} else {
									Api.showTip("删除成功");
									let tempList = [];
									that.clientList.forEach((item, index) => {
										if (item.GoodsID != GoodsID) {
											tempList.push(item);
										}
									})
									that.clientList = tempList;

								}
							} else {
								Api.showTip("服务器开小差了");
							}
						})
					} else {
						console.log("点击了取消")
					}
				})
			},
			//查看更多
			lookMore(index) {
				if (index == this.isLookMore) {
					this.isLookMore = -1;
				} else {
					this.isLookMore = index;
				}
			},
			//修改展示方式
			changeShow() {
				this.isTable = !this.isTable;
			},
			//搜索
			search() {
				if (this.inputStr != "") {
					var Filter = " and ClientName like '%" + this.inputStr + "%'";
					this.Get_GoodsMessage(Filter,false);
				} else {
					this.Get_GoodsMessage(false);
				}
			},
			onShow() {
				this.$eventHub.$off("isOptions");
				let screenHeight = uni.getSystemInfoSync().windowHeight;
				//数据展示部分的高度
				this.tdListHeight = screenHeight - 100;
				//表格除表头部分数据的展示
				this.tdHeight = screenHeight - 140;
				uni.setStorageSync("qckc", "");
			},
			AddListen() {
				var that = this;
				this.$eventHub.$on("isOptions", function(res) {
					that.Get_GoodsMessage(); //显示列表
					that.$eventHub.$off("isOptions");
				})
			}
		},
		created() {
			
			// this.Get_ClientMessage();
			Api.showTip("点击搜索查看商品");
			// this.Get_DepartmentMessage(); //显示列表
		},
		onLoad(options) {
			//是否供应商
			this.isClient = options.isClient;
			uni.setNavigationBarTitle({
				title: "商品档案"
			})
			// 获取表格框的宽度
			let tbWidList = uni.getStorageSync("InfoGoodWidthList", "");
			// console.log(tbWidList);
			if (tbWidList != "") {
				this.clientSettingWidthList = JSON.parse(tbWidList);
				this.clientSettingTempList = JSON.parse(tbWidList);
			}
			uni.setStorageSync("qckc", "");
		},
		computed: {
			//表头总宽度
			allWidth() {
				let allClietnWidth = 0;
				this.clientSettingWidthList.forEach(item => {
					allClietnWidth += parseFloat(item);
				})
				return allClietnWidth;
			}
		}
	}
</script>

<style lang="scss">
	// @import url("./info-GoodsMessage.scss");
	page {
			width: 100%;
			height: 100%;
			padding-bottom: 0px;
			font-family: "宋体";
		}
	
		button::after {
			border: none;
			padding: 0px;
		}
	
		.clientWrapper {
			width: 100%;
			height: 100%;
		}
	
		.clientSearchItem {
			width: 100%;
			height: 50px;
			display: flex;
			box-sizing: border-box;
			padding: 7.5px 5px 0px 5px;
		}
	
		.clientSearchItem02 {
			width: 100%;
			height: 50px;
			display: flex;
			box-sizing: border-box;
			padding: 2px 0px 0px 2px;
			padding-right: 5px;
			box-sizing: border-box;
		}
	
		.clientSearchItem02 .searchBt {
			flex: 1;
			height: 35px;
			line-height: 35px;
			border-radius: 5px;
			border: 1px solid #ccc;
			/* border-top-right-radius: 0px;
			border-bottom-right-radius: 0px; */
			padding-left: 10px;
			font-size: 14px;
			margin-left: 5px;
			background: rgba(124, 170, 216, 1);
			color: #FFF;
		}
	
		.clientSearchItem .clientSearch {
			flex: 1;
			height: 35px;
			line-height: 35px;
			border-radius: 5px;
			border: 1px solid #ccc;
			/* 	border-top-right-radius: 0px;
			border-bottom-right-radius: 0px; */
			padding-left: 8px;
			font-size: 14px;
		}
	
		.clientSearchItem .searchBt {
			width: 60px;
			height: 35px;
			line-height: 35px;
			font-size: 15px;
			border-top-left-radius: 0px;
			border-bottom-left-radius: 0px;
			background-color: rgba(124, 170, 216, 1);
			color: #FFF;
			background-color: #7CAAD8;
		}
	
		.options {
			width: 100%;
			height: 0px;
			display: flex;
			border-top: 1px solid #ccc;
		}
	
		.options button {
			padding-left: 12px;
			padding-right: 12px;
			height: 30px;
			font-size: 12px;
			line-height: 30px;
			margin-top: 5px;
			background: rgba(124, 170, 216, 1);
	
			color: #FFF;
			box-sizing: border-box;
	
		}
	
		.container {
			width: 100%;
			overflow: auto;
		}
	
		.container .tdHeader {
			height: 40px;
			line-height: 40px;
			background: rgba(124, 170, 216, 1);
		}
	
		.container .tdHeader .tdTh {
			display: inline-block;
			text-align: center;
			color: #FFF;
			border-right: 1px solid #ccc;
			box-sizing: border-box;
		}
	
		.tdContain {
			overflow: auto;
		}
	
		.tdContain .tdItems {
			text-align: center;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	
		.tdContain .tdItems.tdItem {
			box-sizing: border-box;
			min-height: 40px;
			float: left;
			border-right: 1px solid #ccc;
			border-bottom: 1rpx solid #ccc;
			padding-left: 4px;
			padding-right: 4px;
			overflow: auto;
			float: left;
			max-height: 40px;
		}
	
		.listContainer {
			width: 100%;
			overflow-x: hidden;
	
		}
	
		.listContainer .tdListItem {
			width: 95%;
			margin: auto;
			margin-bottom: 10upx;
			border-radius: 10upx;
			border: 2upx solid #ebebeb;
			padding-right: 16upx;
			padding-left: 16upx;
			box-sizing: border-box;
			position: relative;
			height: 144upx;
			overflow: hidden;
		}
	
		.listContainer .tdListItem.more {
			display: table;
		}
	
		.listContainer .tdListItem view {
			padding-top: 4upx;
			padding-bottom: 4upx;
			line-height: 40upx;
	
		}
		.listContainer .tdListItem .tdListItemChild view {
			display: flex;
		}
	
		.listContainer .tdListItem view text {
			flex: 1;
		}
	
		.listContainer .tdListItem .clientItemShow {
			display: flex;
		}
	
		.listContainer .tdListItem .ClientTitle {
			font-size: 32upx;
			font-weight: bold;
		}
	
		.listContainer .tdListItem .clientItemShow text {
			flex: 1;
		}
	
		.listContainer .tdListItem .sortIndex {
			/* padding: 0px 5px;
			position: absolute;
			right: 5px;
			top: 5px; */
			border-radius: 4upx;
			background: rgba(124, 170, 216, 1);
			color: #FFF;
			padding-left: 8upx;
			padding-right: 8upx;
			margin-right: 10upx;
			height: 40upx;
			font-size: 24upx;
			line-height: 40upx !important;
		}
	
		.listContainer .tdListItem .lookMore {
			width: 40upx;
			height: 40upx;
			background: url(../../static/pullMore.png) no-repeat;
			position: absolute;
			right: 10upx;
			bottom: 10upx;
			border-radius: 4upx;
			color: #FFF;
			padding: 0px 10upx;
		}
	
		.padding-xl-item {
			display: flex;
		}
	
		.padding-xl-item text {
			min-width: 100px;
			height: 40px;
			line-height: 40px;
			text-align: right;
			padding-right: 10px;
			box-sizing: border-box;
		}
	
		.padding-xl-item input {
			flex: 1;
			border: 1px solid #CCC;
			height: 30px;
			line-height: 30px;
			margin-top: 5px;
		}
	
		.flOptions {
			width: 100%;
			height: 100upx;
			line-height: 100upx;
			display: flex;
			flex-direction: row;
			text-align: center;
			position: fixed;
			bottom: 0upx;
			left: 0upx;
	
			button {
				flex: 1;
				height: 100upx;
				border-radius: 0upx;
				line-height: 100upx;
				background: rgb(124, 170, 216);
				color: #FFF;
	
				&:first-child {
					border-right: 1px solid #FFF;
				}
			}
		}
	
		.lookMoreInfo {
			width: 100upx;
			height: 40upx;
			line-height: 40upx;
			background: rgba(124, 170, 216, 1);
			position: absolute;
			bottom: 10upx;
			right: 10upx;
			padding: 0upx;
			font-size: 24upx;
			color: #FFF;
			border-radius: 4upx;
			// background-size: 100% 100%;
			// transition: height 2s;
			// width: 20px;
			// height: 20px;
		}
		
		.cu-dialog{
			max-height: 800upx;
			min-height: 800upx;
			height: 800upx;
			overflow: hidden;
			
		}
		.cu-bar{
			height: 80upx;
			line-height: 80upx;
			max-height: 80upx;
			min-height: 80upx;
		}
		.padding-xl{
			max-height: 640upx;
			min-height: 640upx;
			overflow: auto;	
			padding: 15upx;
		}
</style>
